﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>jQuery ligerUI 中文官方网站</title>
    <link href="lib/ligerUI/skins/Aqua/css/ligerui-all.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    </style>
    <script src="lib/jquery/jquery-1.3.2.min.js" type="text/javascript"></script>    
    <script src="lib/ligerUI/js/plugins/ligerDrag.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
        <script src="lib/ligerUI/js/plugins/ligerMenu.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerLayout.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerTab.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerAccordion.js" type="text/javascript"></script>
    <script src="lib/ligerUI/js/plugins/ligerTree.js" type="text/javascript"></script>
    
    <script src="lib/ligerUI/js/plugins/ligerWindow.js" type="text/javascript"></script>

    <script src="lib/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
        <script type="text/javascript">
            var tab = null;
            var accordion = null;
            var tree = null;
            $(function ()
            {
                //布局
                $("#layout1").ligerLayout({ leftWidth: 190, height: '100%', onHeightChanged: f_heightChanged });

                var height = $(".l-layout-center").height();

                //Tab
                $("#framecenter").ligerTab({ height: height });

                //面板
                $("#accordion1").ligerAccordion({ height: height - 24, speed: null });

                $(".l-link").hover(function ()
                {
                    $(this).addClass("l-link-over");
                }, function ()
                {
                    $(this).removeClass("l-link-over");
                });
                //树
                $("#tree1").ligerTree({
                    checkbox: false,
                    nodeWidth: 120,
                    attribute: ['nodename', 'url'],
                    onSelect: function (node)
                    {
                        if (!node.data.url) return;
                        var tabid = $(node.target).attr("tabid");
                        if (!tabid)
                        {
                            tabid = new Date().getTime();
                            $(node.target).attr("tabid", tabid)
                        }
                        if ($(">ul >li", tab.tab.links).length >= 4)
                        {
                            var currentTabid = $("li.l-selected", tab.tab.links).attr("tabid"); //当前选择的tabid
                            if (currentTabid == "home") return;
                            tab.overrideTabItem(currentTabid, { tabid: tabid, url: node.data.url, text: node.data.text });
                            return;
                        }
                        f_addTab(tabid, node.data.text, node.data.url);
                    }
                });

                tab = $("#framecenter").ligerGetTabManager();
                accordion = $("#accordion1").ligerGetAccordionManager();
                tree = $("#tree1").ligerGetTreeManager();
                $("#pageloading").hide();
            });

            function f_heightChanged(options)
            {
                if (tab)
                    tab.addHeight(options.diff);
                if (accordion && options.middleHeight - 24 > 0)
                    accordion.setHeight(options.middleHeight - 24);
            }
            function f_addTab(tabid,text, url)
            { 
                tab.addTabItem({ tabid : tabid,text: text, url: url });
            } 
             
            
     </script> 
<style type="text/css"> 
    body{ padding:0px; margin:0;   overflow:hidden;}  
    .l-link{ display:block; height:26px; line-height:26px; padding-left:10px; text-decoration:underline; color:#333;}
    .l-link2{text-decoration:underline; color:white;}
    .l-layout-top{background:#102A49; color:White;}
    .l-layout-bottom{ background:#E5EDEF; text-align:center;}
    #pageloading{position:absolute; left:0px; top:0px; background:white url('loading.gif') no-repeat center; width:100%; height:100%; height:700px; z-index:99999;}
    .l-link{ display:block; line-height:22px; height:22px; padding-left:20px;border:1px solid white; margin:4px;}
    .l-link-over{ background:#FFEEAC; border:1px solid #DB9F00;}
 </style>
</head>
<body style="padding:0px;">  
<div id="pageloading"></div>
  <div id="layout1" style="width:100%">
        <div position="top" style="background:#102A49; color:White; ">
            <div style="margin-top:10px; margin-left:10px">jQuery ligerUI 中文官方网站</div>
        </div>
        <div position="left"  title="主要菜单" id="accordion1"> 
                     <div title="功能列表" class="l-scroll">
                         <ul id="tree1" style="margin-top:3px;">
                                    <li isexpand="false"><span>基础</span><ul> 
                                <li url="demos/base/resizable.htm"><span>改变大小</span></li>
                                <li url="demos/base/drag.htm"><span>拖动</span></li>
                                <li url="demos/base/dragresizable.htm"><span>拖动并改变大小</span></li>
                                <li url="demos/base/tip.htm"><span>气泡</span></li>
                            </ul></li>
                            <li isexpand="false"><span>弹窗</span><ul>
                                <li url="demos/dialog/dialogAll.htm"><span>弹出框</span></li>
                                <li url="demos/dialog/dialogTarget.htm"><span>载入目标DIV</span></li>
                                <li url="demos/dialog/dialogUrl.htm"><span>窗口</span></li> 
                            </ul></li>
                            <li isexpand="false"><span>菜单</span><ul>
                                <li url="demos/menu/menu.htm"><span>菜单</span></li>
                                <li url="demos/menu/evenmenu.htm"><span>事件支持</span></li>
                                <li url="demos/menu/menubar.htm"><span>菜单条/工具条</span></li> 
                                <li url="demos/menu/mulmenu.htm"><span>多个菜单同时存在</span></li>
                            </ul></li>
                            <li isexpand="false"><span>下拉框</span><ul>
                                <li url="demos/comboBox/comboBoxSelect.htm"><span>select表单</span></li>
                                <li url="demos/comboBox/comboBoxSingle.htm"><span>单选</span></li>
                                <li url="demos/comboBox/comboBoxSingleCheckBox.htm"><span>单选(复选框)</span></li>
                                <li url="demos/comboBox/comboBoxMul.htm"><span>多选</span></li>
                                <li url="demos/comboBox/comboBoxTable.htm"><span>表格</span></li>
                                <li url="demos/comboBox/comboBoxTableMul.htm"><span>表格(多选)</span></li>
                                <li url="demos/comboBox/comboBoxInterface.htm"><span>接口方法</span></li>
                                <li url="demos/comboBox/comboBoxEven.htm"><span>事件支持</span></li>
                                <li url="demos/comboBox/comboBoxCase001.htm"><span>联动效果</span></li>
                                <li url="demos/comboBox/comboBoxTree.htm"><span>下拉框 - 树</span></li>
                                <li url="demos/comboBox/comboBoxGrid.htm"><span>下拉框 - 分页表格</span></li>
                            </ul></li>
                            <li isexpand="false"><span>树</span><ul>
                                <li url="demos/tree/treehtml.htm"><span>树(html初使化)</span></li>
                                <li url="demos/tree/treedata.htm"><span>树(data初使化)</span></li>
                                <li url="demos/tree/treeurl.htm"><span>树(url初使化)</span></li>
                                <li url="demos/tree/treeedit.htm"><span>可编辑</span></li>
                                <li url="demos/tree/treemanager.htm"><span>接口方法</span></li>
                                <li url="demos/tree/treeeven.htm"><span>丰富的事件支持</span></li>
                                <li url="demos/tree/treecase.htm"><span>模拟异步动态加载节点</span></li>
                                <li url="demos/tree/treemenu.htm"><span>右键菜单</span></li>
                                 <li url="demos/tree/treecheckboxinit.htm"><span>选择初始化</span></li>
                                 <li url="demos/tree/treedbdata.htm"><span>ID PID数据格式</span></li> 
                            </ul></li>
                            <li isexpand="false"><span>表单</span><ul>
                                <li url="demos/form/checkbox.htm"><span>复选框</span></li>
                                <li url="demos/form/radio.htm"><span>单选框</span></li>
                                <li url="demos/form/spinner.htm"><span>调整器</span></li>
                                <li url="demos/form/dateEditor.htm"><span>日期</span></li> 
                                <li url="demos/form/textbox.htm"><span>文本框</span></li>
                                <li url="demos/form/form1.htm"><span>综合</span></li>
                                <li url="demos/form/form2.htm"><span>表单验证</span></li>
                            </ul></li>
                            <li isexpand="false"><span>表格</span><ul> 
                                <li url="demos/grid/fullgrid.htm"><span>百分比高度表格</span></li>
                                <li url="demos/grid/normalgrid.htm"><span>普通表格</span></li> 
                                <li url="demos/grid/dbeditgrid.htm"><span>编辑表格</span></li> 
                                <li url="demos/grid/grid.htm"><span>本地排序分页</span></li> 
                                <li url="demos/grid/templategrid.htm"><span>模板列</span></li>
                                <li url="demos/grid/totalgrid.htm"><span>汇总表格</span></li>
                                <li url="demos/grid/checkboxgrid.htm"><span>带复选框</span></li> 
                                <li url="demos/grid/selectgrid.htm"><span>选择行支持</span></li> 
                                <li url="demos/grid/delaydata.htm"><span>延时加载</span></li> 
                            </ul></li>
                            <li isexpand="false"><span>Tab</span><ul>
                                <li url="demos/tab/tabHtml.htm"><span>Tab</span></li>
                                <li url="demos/tab/tabEven.htm"><span>事件</span></li>
                                <li url="demos/tab/tabManager.htm"><span>接口</span></li> 
                            </ul></li>
                            <li isexpand="false"><span>面板</span><ul>
                                <li url="demos/accordion/accordion.htm"><span>面板</span></li> 
                            </ul></li>
                            <li isexpand="false"><span>布局</span><ul>
                                <li url="demos/layout/layoutAutoHeight.htm"><span>自动高度</span></li>
                                <li url="demos/layout/layoutAutoHeightAndDiff.htm"><span>高度补差</span></li>
                                <li url="demos/layout/layoutCenterOnly.htm"><span>只显示中间部分</span></li>
                                <li url="demos/layout/layoutFixedHeight.htm"><span>固定高度</span></li>
                                <li url="demos/layout/layoutFullHeight.htm"><span>全屏高度</span></li>
                                <li url="demos/layout/layoutHalfHeight.htm"><span>百分比高度</span></li>
                                <li url="demos/layout/layoutLeftMiddleOnly.htm"><span>只显示左侧和中间</span></li>
                                <li url="demos/layout/layoutLeftWidth.htm"><span>限制左边宽度</span></li>
                                <li url="demos/layout/layoutLeftHide.htm"><span>左边刚开始隐藏</span></li> 
                                <li url="demos/layout/layoutHideToggle.htm"><span>左边右边不允许隐藏</span></li>  
                                <li url="demos/layout/layoutResizeDisable.htm"><span>左边底部不允许调整大小</span></li>  
                            </ul></li>
                         </ul>
                    </div>
                    <div title="应用场景">
                    <div style=" height:7px;"></div>
                         <a class="l-link" href="javascript:f_addTab('listpage','列表页面','demos/case/listpage.htm')">列表页面</a> 
                    </div>    
        </div>
        <div position="center" id="framecenter"> 
            <div tabid="home" title="我的主页" style="height:300px" >
                <iframe frameborder="0" name="home" src="welcome.htm"></iframe>
            </div> 
        </div> 
        <div position="bottom">
            Copyright © 2011 www.ligerui.com
        </div>
    </div> 
        <div style="display:none">
    <!-- 流量统计代码 --> 
    </div>
</body>
</html>
